<template>
  <view class="video-call-transfer">

    <web-view :src="h5WebviewUrl" @error="handleWebViewError"></web-view>

  </view>
</template>

<script>
import config from '@/config/index.js'
import { getToken } from '@/utils/auth.js'
// 导入 URLSearchParams polyfill（兼容微信小程序）
import { getURLSearchParams } from '@/utils/url-search-params-polyfill.js'

export default {
  name: 'VideoCallTransfer',
  data() {
    return {
      h5WebviewUrl: '', // H5版本的webview页面URL
      callParams: {}, // 通话参数
      wsListenerId: null, // WebSocket监听器ID
      processedMessageIds: new Set(), // 存储已处理的消息ID，防止重复处理
      messageIdExpireTime: 5 * 60 * 1000 // 消息ID过期时间（毫秒），避免内存无限增长
    }
  },
  onLoad(options) {
    console.log('VideoCallTransfer 收到参数:', options)

    this.callParams = options

    this.buildH5WebviewUrl(options)
    
    // 注册 WebSocket 监听器处理挂断消息
    this.setupWebSocketListener()

    // #ifdef MP-WEIXIN
    // 在微信小程序中，构建H5版本的webview URL
    // this.buildH5WebviewUrl(options)
    // #endif

    // #ifndef MP-WEIXIN
    // 在其他平台，直接跳转到原生webview页面
    // this.redirectToNativeWebview(options)
    // #endif
  },
  onShow() {
    // 设置页面标题
    if (this.callParams.title) {
      uni.setNavigationBarTitle({
        title: this.callParams.title
      })
    }
  },
  onUnload() {
    // 移除 WebSocket 监听器
    this.removeWebSocketListener()
  },
  methods: {
    // 构建H5版本的webview URL（用于微信小程序）
    buildH5WebviewUrl(options) {
      try {
        // 将参数转换为URLSearchParams格式
        const URLSearchParamsClass = getURLSearchParams()
        const params = new URLSearchParamsClass()

        // 添加所有必要的参数
        if (options.targetId) params.set('targetId', options.targetId)
        if (options.name) params.set('name', options.name)
        if (options.avatar) params.set('avatar', options.avatar)
        if (options.callId) params.set('callId', options.callId)
        if (options.callType) params.set('callType', options.callType)
        if (options.isIncomingCall) params.set('isIncomingCall', options.isIncomingCall)
        if (options.title) params.set('title', options.title)
        if (options.currentUserId) params.set('currentUserId', options.currentUserId)

        // 添加token用于免登陆
        const token = getToken()
        if (token) {
          params.set('token', token)
          console.log('添加token到H5页面参数中')
        } else {
          console.warn('未找到token，H5页面可能需要登录')
        }

        // 添加租户ID用于跨租户支持
        if (config.tenantId) {
          params.set('tenantId', config.tenantId)
          console.log('添加tenantId到H5页面参数中:', config.tenantId)
        } else {
          console.warn('未找到tenantId，可能影响跨租户功能')
        }

        // 添加平台标识，让H5页面知道是在微信小程序中运行
        params.set('platform', 'mp-weixin')

        // 构建完整的H5 webview URL
        // 格式：https://mall.rbtnet.com/pages/webview/index?参数...
        const webviewPath = '/h5/#/pages/webview/index'
        this.h5WebviewUrl = `${config.webviewDomain}${webviewPath}?${params.toString()}`

        console.log('构建的H5 webview URL:', this.h5WebviewUrl)
      } catch (error) {
        console.error('构建H5 webview URL失败:', error)
        this.handleWebViewError()
      }
    },

    // 重定向到原生webview页面（用于非微信小程序平台）
    redirectToNativeWebview(options) {
      try {
        // 重新构建原始的webview页面参数
        const URLSearchParamsClass = getURLSearchParams()
        const params = new URLSearchParamsClass()
        Object.keys(options).forEach(key => {
          if (options[key]) {
            params.set(key, options[key])
          }
        })

        // 添加token用于免登陆
        const token = getToken()
        if (token) {
          params.set('token', token)
          console.log('添加token到原生webview页面参数中')
        } else {
          console.warn('未找到token，原生webview页面可能需要登录')
        }

        // 添加当前用户ID用于WebSocket消息判断
        if (options.currentUserId) {
          params.set('currentUserId', options.currentUserId)
          console.log('添加currentUserId到原生webview页面参数中:', options.currentUserId)
        }

        // 添加租户ID用于跨租户支持
        if (config.tenantId) {
          params.set('tenantId', config.tenantId)
          console.log('添加tenantId到原生webview页面参数中:', config.tenantId)
        } else {
          console.warn('未找到tenantId，可能影响跨租户功能')
        }

        // 直接跳转到原生webview页面
        uni.redirectTo({
          url: `/pages/webview/index?${params.toString()}`,
          fail: (error) => {
            console.error('跳转到原生webview页面失败:', error)
            this.showErrorAndGoBack('启动视频通话失败')
          }
        })
      } catch (error) {
        console.error('重定向到原生webview失败:', error)
        this.showErrorAndGoBack('启动视频通话失败')
      }
    },

    // 处理WebView加载错误
    handleWebViewError(error) {
      console.error('WebView加载错误:', error)
      this.showErrorAndGoBack('视频通话页面加载失败')
    },

    // 显示错误信息并返回
    showErrorAndGoBack(message) {
      uni.showModal({
        title: '提示',
        content: message || '页面加载失败，请重试',
        showCancel: false,
        success: () => {
          // 返回上一页
          uni.navigateBack({
            fail: () => {
              // 如果无法返回，则跳转到首页
              uni.switchTab({
                url: '/pages/index/index'
              })
            }
          })
        }
      })
    },

    // 生成消息唯一标识键
    generateMessageKey(message) {
      try {
        // 消息类型
        const type = message.type || 'unknown';

        // 解析content获取会话ID
        let callId = '';

        if (message.content) {
          try {
            const content = typeof message.content === 'string'
              ? JSON.parse(message.content)
              : message.content;

            // 获取通话/会话ID
            callId = content.callId || '';
          } catch (parseError) {
            console.error('解析消息content失败:', parseError);
          }
        }

        // 生成唯一键：类型_会话ID
        return `${type}_${callId}`;
      } catch (error) {
        console.error('生成消息键失败:', error);
        // 如果生成键失败，使用随机数确保不重复
        return `fallback_${Date.now()}_${Math.random()}`;
      }
    },

    /**
     * 标记消息为已处理
     * @param {String} messageId 消息ID
     */
    markMessageAsProcessed(messageId) {
      // 添加到已处理集合
      this.processedMessageIds.add(messageId);

      // 设置定时器，5分钟后自动清除该消息ID，防止内存无限增长
      setTimeout(() => {
        this.processedMessageIds.delete(messageId);
        console.log('中转页面已清除过期消息ID:', messageId);
      }, this.messageIdExpireTime);

      console.log('中转页面消息已标记为已处理:', messageId);
      console.log('中转页面当前已处理消息数量:', this.processedMessageIds.size);
    },

    // 设置 WebSocket 消息监听（只处理挂断消息）
    setupWebSocketListener() {
      if (!this.$webSocketManager) {
        console.warn('WebSocket管理器未初始化')
        return
      }

      // 生成唯一监听器ID
      this.wsListenerId = `video_call_transfer_${this.callParams.callId || Date.now()}`

      // 添加消息监听器
      this.$webSocketManager.addListener(this.wsListenerId, (message) => {
        this.handleWebSocketMessage(message)
      })

      console.log('中转页面WebSocket监听器已设置:', this.wsListenerId)
    },

    // 移除 WebSocket 监听器
    removeWebSocketListener() {
      if (this.wsListenerId && this.$webSocketManager) {
        this.$webSocketManager.removeListener(this.wsListenerId)
        console.log('中转页面WebSocket监听器已移除:', this.wsListenerId)
        this.wsListenerId = null
      }
    },

    // 处理 WebSocket 消息（只处理挂断消息）
    handleWebSocketMessage(message) {
      try {
        console.log('中转页面收到WebSocket消息:', message)

        // 只处理挂断消息
        if (message && message.type === 'video.call.hangup') {
          // 生成消息唯一标识，用于防止重复处理
          const messageId = this.generateMessageKey(message);

          // 检查是否已处理过此消息
          if (this.processedMessageIds.has(messageId)) {
            console.log('中转页面消息已处理，跳过:', messageId);
            return;
          }

          // 标记消息为已处理
          this.markMessageAsProcessed(messageId);

          // 处理挂断消息
          this.handleHangupMessage(message)
        }
      } catch (error) {
        console.error('中转页面处理WebSocket消息失败:', error)
      }
    },

    // 处理挂断消息
    handleHangupMessage(message) {
      try {
        console.log('处理挂断通话消息:', message)

        // 解析消息内容
        const content = typeof message.content === 'string' 
          ? JSON.parse(message.content) 
          : message.content

        console.log('挂断消息内容:', content)

        // 显示挂断提示
        uni.showToast({
          title: '通话已结束',
          icon: 'none',
          duration: 1500
        })

        // 延迟返回聊天页面，确保用户看到提示
        setTimeout(() => {
          uni.navigateBack({
            fail: () => {
              // 如果无法返回，则跳转到首页
              uni.switchTab({
                url: '/pages/index/index'
              })
            }
          })
        }, 1500)

      } catch (error) {
        console.error('处理挂断消息失败:', error)
        
        // 即使出错也要返回上一页
        uni.navigateBack({
          fail: () => {
            uni.switchTab({
              url: '/pages/index/index'
            })
          }
        })
      }
    }
  }
}
</script>

<style lang="scss" scoped>
.video-call-transfer {
  width: 100%;
  height: 100vh;

  .loading-container {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100vh;
    background: #000;

    .loading-text {
      color: #fff;
      font-size: 16px;
    }
  }
}

/* 微信小程序中web-view全屏显示 */
/* #ifdef MP-WEIXIN */
.video-call-transfer {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: 9999;
}
/* #endif */
</style>
